5
תגובות

CSS | ביטול מרחק בין פריט רשימה למשנהו ללא float

פתח OrelBeY ,
עבור תפריט (ללא שימוש בתמונות).
כי אם אני עושה float אין שום דרך ליישר את התפריט (האופקי) לאמצע (אם יש - תקנו אותי), ואם אני לא עושה float אלא עושה margin, padding, border ו-outline על 0px עדיין יש ביניהם מרחק.
תודה מראש. :)

5 תשובות

avatar ענה intval ב 16 לפברואר 2012 #

תנסה display:inline

avatar ענה OrelBeY ב 16 לפברואר 2012 #

שכחתי לציין שניסיתי גם עם זה (ביחד עם כל ה-margin, padding וכו'), וזה לא עובד. :)

avatar ענה iiddaannyy ב 17 לפברואר 2012 #

display: inline-block.

avatar ענה OrelBeY ב 17 לפברואר 2012 #

לא עוזר...

avatar ענה OrelBeY ב 17 לפברואר 2012 #

חיפשתי שוב והפעם דווקא מצאתי תשובות, תכף אערוך ואציג את הפתרון(ות).
תודה לכם. :)

עריכה:
הכל, כמובן, בהנחה שאתם רוצים ליישר את פריטי הרשימה לאמצע, כשהם באופן אופקי, אחרת אפשר פשוט להשתמש ב-float.
פתרון 1 - לשים את כל הקוד של הרשימה בשורה אחת
דוגמה:

<nav><ul><li><a href="a">דף הבית</a></li><li><a href="b">מאמרים</a></li><li><a href="3">אודות</a></li></ul></nav>

(המטרה היא שלא יהיו רווחים בקוד בין ה-li שאין ברצונכם שיהיו ביניהם רווחים בפלט.)

פתרון 2 - לתת לרשימה font-size של 0
דוגמה:
#myList {font-size:0pt;}
#myList li {font-size: 11pt;}


פתרון 3 - לתת לרשימה letter-spacing של -4px ולפריטי הרשימה 0 או מה שבא לכם
זה תמיד יהיה בדיוק -4 פיקסלים.
הדיפולט של ה-letter-spacing הוא 0, כך שאתם יכולים להחזיר אותו ל-0 אצל פריטי הרשימה (והם כבר יעבירו את זה לילדים שלהם בתורשה).
דוגמה:
#myList {letter-spacing:-4px;}
#myList li {letter-spacing:0px;}


תיהנו! :)